<template>
  <d-dialog
    ref="dialog"
    header="重置密码"
    :api="api"
    v-model:data="formData"
    v-model:visible="visible"
    :rules="rules"
  >
    <!--  api="system/user/resetPwd" -->
    <t-form-item label="新密码" name="password">
      <t-input type="password" v-model="formData.password" placeholder="请输入新密码"></t-input>
    </t-form-item>
  </d-dialog>
</template>

<script setup>
import { merge } from '@common'
import { ref } from 'vue'
const props = defineProps({
  api: String // 声明一个 prop 用于接收动态的 api 值
})
const INIT_STATUS = {
  password: '',
  userId: ''
}
const dialog = ref(null)
const visible = ref(false)
const formData = ref({ ...INIT_STATUS })
const rules = {
  password: [
    { required: true, message: '请输入新密码', trigger: 'blur' },
    {
      message: '8-16位，必须包含大小写字母、数字',
      validator: (val) => {
        return (
          /\d/.test(val) &&
          /[a-z]/.test(val) &&
          /[A-Z]/.test(val) &&
          val.length >= 8 &&
          val.length <= 16
        )
      }
    },
    {
      message: '输入的字符不合法',
      validator: (val) => {
        const newVal = val.replace(/\d/g, '').replace(/[a-z]/gi, '')
        return !/[^!@#%&_]/.test(newVal)
      }
    }
  ]
}
const show = async (info = {}) => {
  const isEdit = !!info.userId
  const obj = merge({ ...INIT_STATUS, isEdit }, info)
  formData.value = obj
  visible.value = true
}
defineExpose({ show })
</script>
